<!-- 检测任务 -->
<template>
	<view class="page">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block style="color: #777777;font-size: 48rpx;" slot="content">检测任务</block>
		</cu-custom>

		<view v-if="!dataEmpty" :style="{'height':scrollHeight+'px'}" style="overflow: hidden;">
			<movable-refresh ref="movableRefresh" :scrollHeight="scrollHeight" :noMore="noMore" :showGoTop="true"
				@refresh="refresh" @loadMore="loadMore" @scrollTop="scrollTop">
				<view>
					<view class="content" v-for="(item,index) in list" :key="index">
						<view class="pd">
							<text class="title">{{item.taskName}}</text>
							<text>业主企业：{{item.examineName}}</text>
							<text>维保企业：{{item.enterpriseName}}</text>
							<text>上报时间：{{item.addTime}}</text>
							<text>任务状态：{{item.examineStatusStr}}</text>
							<button class="my-btn cu-btn bg-blue shadow" @click="see_detail(item.ucId)">查看详情</button>
						</view>
					</view>
				</view>
			</movable-refresh>
		</view>

		<view v-if="dataEmpty" class="empty"></view>
	</view>
</template>

<script>
	import movableRefresh from '@/components/zyq-movableRefresh/zyq-movableRefresh.vue'
	export default {
		components: {
			movableRefresh
		},
		onLoad() {
			let system = uni.getSystemInfoSync()
			this.scrollHeight = system.windowHeight - system.statusBarHeight - 50

		},
		onShow() {
			this.refresh()
		},
		data() {
			return {
				list: [],
				scrollHeight: 300,
				noMore: false,
				pageNum: 1,
				pageSize: 10,
				dataEmpty: false
			}
		},
		methods: {
			scrollTop(scrollTop) {
				this.scrollTop = scrollTop
			},
			refresh() {
				this.pageNum = 1
				let that = this
				that.noMore = false
				let list = []
				// 封装参数
				let params = {
					"pageNum": that.pageNum,
					"pageSize": that.pageSize
				}
				// 请求数据
				let app = getApp()
				app.globalData.request({
					url: 'wx/examine/getInExamineTaskPage',
					data: {
						...params
					}
				}).then(function(res) {

					let datas = res.data.data.list
					let recors = []
					for (let i = 0; i < datas.length; i++) {
						recors.push(datas[i])
					}
					that.list = recors

					that.pageNum++
					console.info("pagenum:" + that.pageNum)

					if (res.data.data.pages === 1) {
						that.noMore = true
					}

					if (that.$refs.movableRefresh) {
						let that_ = that
						setTimeout(function() {
							that_.$refs.movableRefresh.endLoad() //刷新结束
							if (that_.list.length == 0) {
								that_.dataEmpty = true
							} else {
								that_.dataEmpty = false
							}
						}, 1000)
					}
				}).catch(function(e) {
					uni.showToast({
						title: "请稍后再试",
						icon: 'none'
					})
				})


			},
			loadMore() {
				if (this.noMore) {
					return
				}

				let list = this.list
				let that = this
				if (that.pageNum) {

				}
				// 封装参数
				let params = {
					"pageNum": this.pageNum,
					"pageSize": this.pageSize
				}
				// 请求数据
				let app = getApp()
				app.globalData.request({
					url: 'wx/examine/getInExamineTaskPage',
					data: {
						...params
					}
				}).then(function(res) {
					let datas = res.data.data.list
					for (let i = 0; i < datas.length; i++) {
						list.push(datas[i])
					}
					that.list = list


					that.pageNum++
					if (res.data.data.pages === that.pageNum) {
						that.noMore = true
					}

					if (that.$refs.movableRefresh) {
						let that_ = that
						setTimeout(function() {
							that_.$refs.movableRefresh.endLoad() //刷新结束
						}, 1000)
					}
				}).catch(function(e) {

				})
			},
			see_detail(ucId) {
				uni.navigateTo({
					url: '../jcxq/jcxq?ucId=' + ucId
				})
			}
		}
	}
</script>

<style scoped>
	.pd {
		background-color: #FFFFFF;
		margin: 20rpx 0;
		padding: 20rpx 0;
	}

	.pd text {
		display: flex;
		margin-left: 20rpx;
		font-size: 24rpx;
		color: #151515;
		letter-spacing: 0.39px;
		line-height: 50rpx;
	}

	.pd .title {
		font-size: 32rpx;
		color: #333333;
	}

	.pd .time {
		position: relative;
	}

	.pd .my-btn {
		position: absolute;
		right: 40px;
		margin-top: -40px;
	}

	.empty {
		height: 80vh;
		background: url(/static/common/empty.png) no-repeat center;
	}
</style>
